<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="../js/vue.js"></script>
		<script src="../js/elementui.js"></script>
		<link rel="stylesheet" href="../css/index.css">
	</head>
	<body>
		<div id="app">
			<template>
				<el-radio v-model="radio" label="1">备选项</el-radio>
				<el-radio v-model="radio" label="2">备选项</el-radio>
			</template>
			<hr />
			<template>
				<el-radio disabled v-model="radio2" label="禁用">备选项</el-radio>
				<el-radio disabled v-model="radio2" label="选中且禁用">备选项</el-radio>
			</template>
			<hr />
			<template>
				<el-radio-group v-model="radio3">
					<el-radio :label="3">备选项</el-radio>
					<el-radio :label="6">备选项</el-radio>
					<el-radio :label="9">备选项</el-radio>
				</el-radio-group>
			</template>
			<hr />
			<template>
				<div>
					<el-radio-group v-model="radio1_1">
						<el-radio-button label="上海"></el-radio-button>
						<el-radio-button label="北京"></el-radio-button>
						<el-radio-button label="广州"></el-radio-button>
						<el-radio-button label="深圳"></el-radio-button>
					</el-radio-group>
				</div>
				<div style="margin-top: 20px">
					<el-radio-group v-model="radio1_2" size="medium">
						<el-radio-button label="上海"></el-radio-button>
						<el-radio-button label="北京"></el-radio-button>
						<el-radio-button label="广州"></el-radio-button>
						<el-radio-button label="深圳"></el-radio-button>
					</el-radio-group>
				</div>
				<div style="margin-top: 20px">
					<el-radio-group v-model="radio1_3" size="small">
						<el-radio-button label="上海"></el-radio-button>
						<el-radio-button label="北京" disabled></el-radio-button>
						<el-radio-button label="广州"></el-radio-button>
						<el-radio-button label="深圳"></el-radio-button>
					</el-radio-group>
				</div>
				<div style="margin-top: 20px">
					<el-radio-group v-model="radio1_4" disabled size="mini">
						<el-radio-button label="上海"></el-radio-button>
						<el-radio-button label="北京"></el-radio-button>
						<el-radio-button label="广州"></el-radio-button>
						<el-radio-button label="深圳"></el-radio-button>
					</el-radio-group>
				</div>
			</template>
			<hr />
			<template>
				<div>
					<el-radio v-model="radio2_1" label="1" border>备选项1</el-radio>
					<el-radio v-model="radio2_1" label="2" border>备选项2</el-radio>
				</div>
				<div style="margin-top: 20px">
					<el-radio v-model="radio2_2" label="1" border size="medium">备选项1</el-radio>
					<el-radio v-model="radio2_2" label="2" border size="medium">备选项2</el-radio>
				</div>
				<div style="margin-top: 20px">
					<el-radio-group v-model="radio2_3" size="small">
						<el-radio label="1" border>备选项1</el-radio>
						<el-radio label="2" border disabled>备选项2</el-radio>
					</el-radio-group>
				</div>
				<div style="margin-top: 20px">
					<el-radio-group v-model="radio2_4" size="mini" disabled>
						<el-radio label="1" border>备选项1</el-radio>
						<el-radio label="2" border>备选项2</el-radio>
					</el-radio-group>
				</div>
			</template>
		</div>
	</body>

	<script>
		new Vue({
			el: "#app",
			data: {
				radio: '1',
				radio2: '选中且禁用',
				radio3: 3,
				radio1_1: '上海',
				radio1_2: '上海',
				radio1_3: '上海',
				radio1_4: '上海',
				radio2_1: '1',
				radio2_2: '1',
				radio2_3: '1',
				radio2_4: '1'
			}
		})
	</script>

</html>